<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<!-- 3.新制作一个注册页面，要求
		      3.1 要求包含用户名，密码，性别，学院，爱好，自我介绍及提交按钮
		      3.2 包含:输入框，密码框，单选框，多选框，文本域，下拉列表
		      3.3 每个需要提交的标签都要有name值
		      3.4 按照name的方式查找各个元素
		      3.5 按照标签的方式查找各个元素 -->

		<form action="#" method="get">
			用户名:<input type="text" name="userName" id="" value="" />
			<br />
			密码:<input type="password" name="password" />
			<br />
			性别:<input name="gender" type="radio" value="man">男<input name="gender" type="radio" value="women">女
			<br />
			学院:
			<select name="collge">
				<option value="rg">软件工程学院</option>
				<option value="xz">信息制造学院</option>
			</select>
			<br />
			爱好:<input type="checkbox" value="pingpong " name="like" />乒乓球
				 <input type="checkbox" value="run " name="like" />跑步
			<br />
			自我介绍:<textarea name="intro"></textarea>
			<br />
			<input type="submit" value="提交按钮" />
		</form>
		<button id="b_get_form_byName">获取formByName</button>
		<button id="b_get_form_byTag">获取formByTag</button>

	</body>
	<script>
		function findFormByName() {
			console.log("S 获取formByName")
			console.log(document.getElementsByName("userName"))
			console.log(document.getElementsByName("password"))
			console.log(document.getElementsByName("gender"))
			console.log(document.getElementsByName("collge"))
			console.log(document.getElementsByName("like"))
			console.log(document.getElementsByName("intro"))
			console.log("E 获取formByName")
		}
		document.getElementById("b_get_form_byName").onclick = findFormByName;
		
			function findFormByTag() {
				console.log("S 获取formByTag")
				console.log(document.getElementsByTagName("input"))
				console.log(document.getElementsByTagName("select"))
				console.log(document.getElementsByTagName("textarea"))
				console.log("E 获取formByTag")
			}
			document.getElementById("b_get_form_byTag").onclick = findFormByTag;
	</script>
</html>
